<template>
  <div class="footer-box column" :style="routePath
    ? 'background: #ffffff;'
    : 'background: #F9F9F9;'
  " v-show="!store.state.loginHide">
    <div class="gzh-font-box">
      微信客服：请点击 查看<span @click="toShowImg">"宏联科技校园服务"</span>
    </div>
    <div>
      客服热线：电信移动：968899 联通：23396868
    </div>
    <div>
      值班时间：周一至周五 8:30-12:00 13:30-17:30
    </div>
    <div class="company-flex-box">
      <span><van-icon name=" iconfont icon-icon_copyright"></van-icon>
        {{ nowYear }}</span>
      广东宏联科技有限公司
    </div>
  </div>
</template>
<script lang="ts" setup>
import { ref, computed, defineComponent, onMounted, watch } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { useStore } from 'vuex'
interface emitType {
  (e: 'showOver'): void
}
const emit = defineEmits<emitType>()
const store = useStore()
const clientHeight = window.innerHeight
const route = useRoute()
const routePath = ref(false)
const fixedShow = ref(false)
const nowYear = computed(() => {
  const date = new Date()
  return '2009-' + date.getFullYear()
})
const toShowImg = () => {
  emit('showOver')
}
watch(
  () => route.path,
  (newValue, old) => {
    // if (newValue === '/managerRecord') {
    //   fixedShow.value = false
    //   routePath.value = true
    // } else {
    //   if (newValue === '/login') {
    //     fixedShow.value = true
    //     if (clientHeight < 667) {
    //       fixedShow.value = false
    //     }
    //   }
    //   if (newValue !== '/homeView') {
    //     routePath.value = true
    //   } else {
    //     routePath.value = false
    //   }
    // }
    if (newValue === '/' || newValue === '/index'||newValue === '/homeView') {
      routePath.value = false
    } else if (newValue === '/login') {
      fixedShow.value = true
      if (clientHeight < 667) {
        fixedShow.value = false
      }
    } else {
      routePath.value = true
    }
  }
)
onMounted(() => {
  // routePath.value = route.path
  if (route.path === '/userMessage' || route.path === '/login') {
    routePath.value = true
  } else {
    routePath.value = false
  }
  console.log(routePath.value)
})
</script>
<style lang="scss" scoped>
.footer-box {
  width: 100%;
  text-align: center;
  color: #d2d2d2;
  font-size: 12px;
  font-family: 'Regular';
  padding: 10px 0;
  position: relative;

  div {
    color: #999;
    margin-bottom: 3px;
  }

  .company-flex-box {
    color: #d2d2d2;
    margin-bottom: 0;
  }

  span {
    margin-right: 5px;

    i {
      font-size: 12px;
      color: #d2d2d2;
    }
  }
}

.gzh-font-box {
  span {
    color: #146af7;
    // text-decoration: underline;
  }
}

.fixed-flex-box {
  position: fixed;
  bottom: 0px;
  background: transparent !important;
}
</style>
